<template>
  <div class="goods-wrap">
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
    <p>商品列表</p>
  </div>
</template>

<script setup lang="ts">
import api from '@/apis/index'
import { onMounted } from 'vue'

onMounted(() => {
  getGoodsList()
})

const getGoodsList = () => {
  api.goods.getGoodsList().then(res => {
    console.log('商品列表', res.data)
  })
}
</script>

<style lang="less">
.goods-wrap {
  overflow: auto;
  border: 3px solid #de5e60;
  height: 100%;
}
</style>
